<!DOCTYPE html> 
<html> 
  <head>  
    <!--META-->
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=0.75">
    <meta http-equiv="X-UA-Compatible" content="IE=Edge">

    <!--CSS-->
    <link rel="stylesheet" href="API/css/themes/default/jquery.mobile.min.css" />
    <link rel="stylesheet" href="API/css/themes/default/jquery.mobile.structure.min.css" />
    <link rel="stylesheet" href="API/css/themes/default/jquery.mobile.theme.min.css" />
    <link rel="stylesheet" href="API/css/mycss.css" />
    <link rel="stylesheet" href="css/mycss.css" />

    <!--JS-->
    <script type="text/javascript" src="API/js/jquery.min.js"></script>
    <script type="text/javascript" src="API/js/jquery.mobile.min.js"></script>
    <!--<script type="text/javascript" src="API/js/highcharts.js"></script>-->
    <!--<script type="text/javascript" src="API/js/modules/exporting.js"></script>-->
    <!--<script type="text/javascript" src="API/js/jquery.dataTables.min.js"></script>-->
    <script type="text/javascript" src="include/config.js"></script>
    <script type="text/javascript" src="API/js/fonctions.js"></script>
    <script type="text/javascript" src="js/fonctions.js"></script>

    <script language="javascript" type="text/javascript">
    checkMaintenance();
    checkAuthentification();
	
		///////////////////
		//BLOCK VARIABLE GLOBAL
		///////////////////
		var id_page = 28;
    
		///////////////////
		//BLOCK FONCTIONS EVENEMENTS
		///////////////////
		//A la construction de la page
		$(document).on('pageinit',function() {
		    try {
				// Init commmun
			
				// Init page
            }
            catch (er) {
                log(0, "ERROR(init_home):" + er.message);
            }
        });

		//Affichage de la page avant onload
		$(document).on('pageshow',function() {
			try {
				// Fin affichage commun
			}
			catch (er) {
				log(0, "ERROR(show):" + er.message);
			}
		});
		
		//Fin chargement page
		function OnLoad() {
            try {
				// Init commmun
				init_commun();
				
				// Fin affichage commun
				show_commun();
			
				afficher_listes();
				charger_listeUsers();
            }
            catch (er) {
                log(0, "ERROR(OnLoad):" + er.message);
            }
        }
		
		///////////////////
		//BLOCK FONCTIONS METIER
		///////////////////
		function afficher_listes() {
            try {
				$("#div_Listes").text("");
				
				var tabListesUsers = new Array();
				tabListesUsers = getListesUsersByPropri(auth);
				
				for (var indice in tabListesUsers) {
					strRetour = "";
                    strRetour += "<label for=\"liste_"+tabListesUsers[indice][0]+"\">"+tabListesUsers[indice][1]+"</label>";
                    strRetour += "<SELECT name=\"liste_"+tabListesUsers[indice][0]+"\" id=\"liste_"+tabListesUsers[indice][0]+"\" data-mini=\"true\" multiple=\"multiple\" data-native-menu=\"false\" size=\"4\" onchange=\"majListe('"+tabListesUsers[indice][0]+"')\">";
                    strRetour += "<option value=\"\" data-placeholder=\"true\">"+tabListesUsers[indice][1]+"</option>";
					
					var tabUsers = new Array();
					tabUsers = getUsersInListe(tabListesUsers[indice][0]);
					for (var indice0 in tabUsers) {
						strSelected = "";
						if(tabUsers[indice0][3] == "1"){
							strSelected = "selected";
						}
						strRetour += "<option value=\""+tabUsers[indice0][0]+"\" "+strSelected+" >"+tabUsers[indice0][1]+" "+tabUsers[indice0][2]+"</option>";
					}
					
                    strRetour += "</SELECT>";
				
					$("#div_Listes").append(strRetour).trigger('create');
                }
            }
            catch (er) {
                log(0, "ERROR(afficher_listes):" + er.message);
            }
        }
		
		function majListe(p_id_liste) {
            try {
				var strSQL = "DELETE FROM tab_listes_users_contenus WHERE 1=1 AND id_listes_users = "+p_id_liste+";";
				deleteSQL(strSQL);
			
                var tabUsers = new Array();
				tabUsers = $("#liste_"+p_id_liste).val();
				
				if(tabUsers == null){
					var strSQL = "DELETE FROM tab_listes_users WHERE 1=1 AND id = "+p_id_liste+";";
					deleteSQL(strSQL);
					$("#liste_"+p_id_liste).selectmenu("close");
					$("#liste_"+p_id_liste).remove();
					$('label[for="liste_'+p_id_liste+'"]').remove();
				}else{
					var strSQL = "INSERT INTO `tab_listes_users_contenus` VALUES ";
					for (var indice in tabUsers) {
						strSQL += "(NULL ,  '"+p_id_liste+"',  '"+tabUsers[indice]+"'),";
					}
					
					strSQL = strSQL.substring(0,strSQL.length-1);
					strSQL += ";";
					
					insertSQL(strSQL);
				}
            }
            catch (er) {
                log(0, "ERROR(afficher_listes):" + er.message);
            }
        }
		
		function charger_listeUsers() {
            try {
				var myObj = document.getElementById("listeUsers");
				
				var tabUsers = new Array();
				tabUsers = getUsersInListe(0);
				
				for (var indice in tabUsers) {
					myObj.options[myObj.options.length] = new Option((tabUsers[indice][1]+" "+tabUsers[indice][2]),tabUsers[indice][0]);
				}
				
				$("#listeUsers").selectmenu('refresh', true);
            }
            catch (er) {
                log(0, "ERROR(charger_listeUsers):" + er.message);
            }
        }
		
		function ajouterListe() {
            try {
				var tabUsers = new Array();
				tabUsers = $("#listeUsers").val();
				
				var strNomListe = $("#nomListe").val();
				
				if((tabUsers != null)&&((strNomListe != null)||(strNomListe != ""))){
					var strSQL = "INSERT INTO `tab_listes_users` (`id` ,`titre` ,`code_user`) VALUES (NULL ,  '"+$("#nomListe").val()+"',  '"+auth+"');";
					insertSQL(strSQL);
					
					var strSQL = "SELECT id FROM `tab_listes_users` order by id desc LIMIT 0 , 1;";
					var maxId = getSQL(strSQL)[0][0];
					
					var strSQL = "INSERT INTO `tab_listes_users_contenus` VALUES ";
					for (var indice in tabUsers) {
						strSQL += "(NULL ,  '"+maxId+"',  '"+tabUsers[indice]+"'),";
					}
					
					strSQL = strSQL.substring(0,strSQL.length-1);
					strSQL += ";";
					
					insertSQL(strSQL);
					
					location.reload();
				}else{
					$("#id_msgRetour").html('Mauvaises entr&eacute;es pour cr&eacute;er la liste.');
				}
            }
            catch (er) {
                log(0, "ERROR(afficher_listes):" + er.message);
            }
        }
		
		///////////////////
		//BLOCK FONCTIONS BD
		///////////////////
		
		
		///////////////////
		//BLOCK FONCTIONS AFFICHAGE
		///////////////////
		
    </script>

  </head>
  <body onload="OnLoad();">
    
	<!-- page -->
	<div data-role="page" data-title="Administration des listes - Outil d'audit Automatique">
	
		<!-- /panel -->
		<div data-role="panel" id="mypanel" data-display="overlay" data-position="left">

		</div>
		<!-- /panel -->
	
		<!-- header -->
		<div data-role="header" data-position="fixed">
			<a href="#mypanel" data-role="button" data-icon="home" data-iconpos="notext">home</a>
			<h1 id="id_titre">titre</h1>
			<a href="javascript:window.location = ('./page_contact.html?mili='+getMilise());" data-role="button" data-icon="info" data-iconpos="notext">Contact</a>
		</div>
		<!-- /header -->

		<!-- content -->
		<div data-role="content" id="main_content">
		
			<div data-role="collapsible" data-collapsed="false" data-mini="true">
				<h3>Mes listes</h3>
					<FORM method="post" id="formListes" action="#">
							<div id="div_Listes">Pas de r&eacute;sultat.</div>
					</FORM>
			</div>
			
			<div data-role="collapsible" data-collapsed="false" data-mini="true">
				<h3>Nouvelle liste</h3>
					<FORM method="post" id="formNewListe" action="#">
						<div class="ui-grid-a">
							<div class="ui-block-a">
								<label for="nomListe">Nom de la liste :</label>
								<input type="text" name="nomListe" id="nomListe" value="" placeholder="Le nom de votre liste"/>
							</div>
							<div class="ui-block-b">
								<label for="listeUsers">Liste des utilisateurs</label>
								<SELECT name="listeUsers" id="listeUsers" multiple="multiple" data-mini="true" data-native-menu="false">
									<option value="" data-placeholder="true">Les utilisateurs</option>
								</SELECT>
							</div>
						</div>	
						<a href="javascript:ajouterListe();" data-role="button" data-inline="true" data-icon="arrow-r" data-mini="true">Ajouter cette liste</a>
					</FORM>
					<label id="id_msgRetour"></label>
			</div>
			
		</div>
		<!-- /content -->
		
		<!-- footer -->
		<div data-role="footer" data-position="fixed">
			<a data-role="button" data-icon="search" data-iconpos="notext" class="ui-btn-left" href="javascript:window.location = ('./page_faq.html?mili='+getMilise());">FAQ</a>
			<h1 id="id_affichageUser">User</h1>
			<a data-role="button" data-icon="delete" data-iconpos="notext" class="ui-btn-right" href="javascript:window.location = ('./page_sortie.html?mili='+getMilise());">Logout</a>
		</div>
		<!-- /footer -->
		
	</div>
	<!-- /page -->
  </body>
</html>